<template>
  <div>
    <a-layout id="components-layout-demo-responsive">
      <a-layout-sider :trigger="null" collapsible collapsedWidth="0" class="sider sider-left" width="100%">
        <div class="goods" id="goods" style="margin-left:30px;">
          <div id="components">
            <div class="memberinfo">
              <div class="origintext">
                来自
                <span
                  >{{ fromprogramname }}小程序<span v-if="qiyuCustomer.crm_storeName">-{{ qiyuCustomer.crm_storeName }}</span></span
                >
              </div>
              <div class="membertotal">
                <span
                  >累计消费 <i v-if="memberInfo.cumulativeConsume">¥{{ memberInfo.cumulativeConsume }}</i
                  ><i v-else>--</i></span
                >
                <span
                  >最近消费 <i v-if="memberInfo.recentConsumption">¥{{ memberInfo.recentConsumption }} （{{ memberInfo.recentConsumeTime }}）</i><i v-else>--</i></span
                >
              </div>
            </div>
            <div>
              <span style="font-size: 16px;font-family: PingFangSC-Medium, PingFang SC;font-weight: 500;color: #000000;">{{
                customerInfo.details.nickName ? customerInfo.details.nickName : qiyuCustomer.crm_salesrepName
              }}</span>
              <span style="font-size: 16px;font-family: PingFangSC-Medium, PingFang SC;font-weight: 500;color: #000000;"
                >（{{ customerInfo.details.phone ? customerInfo.details.phone : MobilePhone }}）</span
              >

              <a-tag color="orange" v-if="qiyuCustomer.crm_groupVipTypeName"> {{ qiyuCustomer.crm_groupVipTypeName }} </a-tag>
            </div>
            <div style="margin-bottom:12px;">
              <span class="edit-size" style="color: #595959;">{{ genderType[customerInfo.details.gender] }}</span>
              <span class="edit-size" style="color: #262626;">{{ customerInfo.age }}岁（{{ customerInfo.details.birthday ? customerInfo.details.birthday : '-' }})</span>
              <div v-if="couponList.isShow" style="display:inline-block;">
                <a-tooltip placement="top">
                  <template slot="title">
                    <div v-for="(item, index) in couponList.list" :key="index">{{ item }}</div>
                  </template>
                  <img style="width:71px;height:18px;" src="https://img.bzhz.jnbygroup.com/birthimg.png" alt="" />
                </a-tooltip>
              </div>
            </div>
            <a-descriptions :column="2">
              <a-descriptions-item label="集团积分">
                {{ customerInfo.integer ? customerInfo.integer : '--' }}
              </a-descriptions-item>
              <a-descriptions-item label="累计集团消费" v-if="customerInfo.groupBuyAmount"> ¥ {{ customerInfo.groupBuyAmount }} </a-descriptions-item>
              <a-descriptions-item label="累计集团消费" v-else> -- </a-descriptions-item>
              <a-descriptions-item label="品牌卡号"> {{ qiyuCustomer.crm_cardNo ? qiyuCustomer.crm_cardNo : '--' }}</a-descriptions-item>
              <a-descriptions-item label="归属门店"> {{ qiyuCustomer.crm_homeStoreName ? qiyuCustomer.crm_homeStoreName : '--' }} </a-descriptions-item>
              <a-descriptions-item label="折扣偏好" v-if="customerInfo.discountPreference.avgDiscount"
                >{{ customerInfo.discountPreference.avgDiscount }} ({{ customerInfo.discountPreference.avgDiscountRange }})</a-descriptions-item
              >
              <a-descriptions-item label="折扣偏好" v-else> -- </a-descriptions-item>
            </a-descriptions>
          </div>

          <a-divider />
          <div id="components-product">
            <div style="margin-bottom:12px">
              <img src="../../assets/box.png" class="edit-icon" />
              <span class="icon-title">正在咨询</span>
            </div>
            <div>
              <span class="colortext" v-if="myQiyuCustomer.crm_goodsId">商品咨询</span>
              <span class="colortext" v-if="myQiyuCustomer.crm_orderId">订单咨询</span>
            </div>
            <a-list class="demo-loadmore-list order-list" style="display:block" :loading="loading" item-layout="horizontal" :data-source="recentBrowseing">
              <a-list-item v-if="myQiyuCustomer.crm_goodsId" slot="renderItem" slot-scope="item, index" :key="index">
                <div style="display:flex;">
                  <div class="img-box">
                    <p class="tagType blue" v-if="item.type == 2">退货</p>
                    <img :src="item.imgurl ? item.imgurl : 'https://img.bzhz.jnbygroup.com/cloth.png'" class="order-img" @click="open(item)" />
                    <!-- <a-tag color="orange">{{ item.channel }}</a-tag> -->
                  </div>
                  <div style="overflow: hidden">
                    <a-tooltip placement="topLeft">
                      <template slot="title">
                        <span>【{{ item.brand }}】{{ item.value }} </span>
                      </template>
                      <h3 class="commodity—title">【{{ item.brand }}】{{ item.value }}</h3>
                    </a-tooltip>
                    <a-descriptions :column="1" class="transaction">
                      <a-descriptions-item label="款号">
                        {{ item.name }}
                      </a-descriptions-item>
                    </a-descriptions>
                    <div class="price">
                      <span style="color: #8c8c8c;min-width: 40px !important;display:inline-block;">价格</span>
                      <span>{{ item.promotionPrice }}</span>
                      <span>{{ item.price.toFixed(2) }}</span>
                    </div>
                  </div>
                </div>
                <div :style="item.inLook == 1 ? 'margin:8px 0 0px 76px' : 'margin:8px 0 0px 156px;'">
                  <a-button type="primary" ghost v-if="item.inLook == 1" class="threebtn2" @click="showRecommend(item)">推荐搭配</a-button>
                  <a-button type="primary" class="threebtn2" @click="showsimilarGoods(item)">相似商品</a-button>
                  <a-button type="primary" class="threebtn" @click="sendcard(item.imgurl, item.value, item.weiMoProductId, item.promotionPrice)">发送</a-button>
                </div>
              </a-list-item>
              <a-list-item v-if="myQiyuCustomer.crm_orderId" slot="renderItem" slot-scope="item, index" :key="index">
                  <OrderItem @sendOrderCard="onSendOrderCard" :item="item"></OrderItem>
              </a-list-item>
            </a-list>
            <a-divider />
            <div id="components-order">
              <div class="section-title">
                <img src="../../assets/record.png" class="edit-icon" />
                <span class="icon-title">近期订单</span>
                <span style="margin-left: 5px;">列表展示近30天内订单，如需查询更早订单，请进入微盟后台查询</span>
              </div>
              <a-list class="demo-loadmore-list order-list" :loading="orderLoading" item-layout="horizontal" :data-source="productOrderList">
                <div v-if="showLoadingOrderMore" slot="loadMore" :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
                  <a-spin v-if="loadingOrderMore" />
                  <a v-else @click="onLoadOrderMore"> 加载更多 </a>
                </div>
                <a-list-item slot="renderItem" slot-scope="item, index" :key="index">
                  <OrderItem @sendOrderCard="onSendOrderCard" :item="item"></OrderItem>
                </a-list-item>
              </a-list>
            </div>
            <a-divider />
            <div>
              <span style="font-weight: 500;color: #262626;">最近浏览</span>
            </div>
            <a-list class="demo-loadmore-list order-list" :loading="loading2" item-layout="horizontal" :data-source="recentBrowseList">
              <div v-if="showLoadingMore2" slot="loadMore" :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
                <a-spin v-if="loadingMore2" />
                <a v-else @click="onLoadMore2"> 加载更多 </a>
              </div>
              <a-list-item slot="renderItem" slot-scope="item, index" :key="index">
                <div style="display:flex;">
                  <div class="img-box">
                    <p class="tagType blue" v-if="item.type == 2">退货</p>
                    <img :src="item.coverPicture ? item.coverPicture : 'https://img.bzhz.jnbygroup.com/cloth.png'" class="order-img" @click="open(item)" />
                    <!-- <a-tag color="orange">{{ item.channel }}</a-tag> -->
                  </div>
                  <div style="overflow: hidden">
                    <a-tooltip placement="topLeft">
                      <template slot="title">
                        <span>【{{ item.brand }}】{{ item.goodName }} </span>
                      </template>
                      <h3 class="commodity—title">【{{ item.brand }}】{{ item.goodName }}</h3>
                    </a-tooltip>
                    <a-descriptions :column="1" class="transaction">
                      <a-descriptions-item label="款号">
                        {{ item.name }}
                      </a-descriptions-item>
                    </a-descriptions>
                    <div class="price">
                      <span style="color: #8c8c8c;min-width: 40px !important;display:inline-block;">价格</span>
                      <span>{{ item.promotionPrice }}</span>
                      <span>{{ item.price.toFixed(2) }}</span>
                    </div>
                  </div>
                </div>
                <div>浏览 {{ item.browseNumber }} 次，共 {{ item.browseDuration }} S，最近浏览 {{ item.browseTime }}</div>
                <div :style="item.inLook == 1 ? 'margin:8px 0 0px 76px' : 'margin:8px 0 0px 168px;'">
                  <a-button type="primary" ghost class="threebtn2" v-if="item.inLook == 1" @click="showRecommend(item)">推荐搭配</a-button>
                  <a-button type="primary" class="threebtn2" @click="showsimilarGoods(item)">相似商品</a-button>
                  <a-button type="primary" class="threebtn" @click="sendcard(item.coverPicture, item.goodName, item.productId, item.promotionPrice)">发送</a-button>
                </div>
              </a-list-item>
            </a-list>
          </div>
          <a-divider />
          <div id="components-shopping">
            <div>
              <img src="../../assets/transaction.png" class="edit-icon" />
              <span class="icon-title">购物车</span>
            </div>
            <a-list class="demo-loadmore-list order-list" :loading="loading3" item-layout="horizontal" :data-source="shoppCarting">
              <div v-if="showLoadingMore3" slot="loadMore" :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
                <a-spin v-if="loadingMore3" />
                <a v-else @click="onLoadMore3"> 加载更多 </a>
              </div>
              <a-list-item slot="renderItem" slot-scope="item, index" :key="index">
                <div style="display:flex;">
                  <div class="img-box">
                    <p class="tagType blue" v-if="item.type == 2">退货</p>
                    <img :src="item.imgUrl ? item.imgUrl : 'https://img.bzhz.jnbygroup.com/cloth.png'" class="order-img" @click="open(item)" />
                    <a-tag color="orange">{{ item.channel }}</a-tag>
                  </div>
                  <div style="overflow: hidden">
                    <a-tooltip placement="topLeft">
                      <template slot="title">
                        <span>【{{ item.brand }}】{{ item.goodsName }} </span>
                      </template>
                      <h3 class="commodity—title">【{{ item.brand }}】{{ item.goodsName }}</h3>
                    </a-tooltip>
                    <a-descriptions :column="2" class="transaction">
                      <a-descriptions-item label="款号">
                        {{ item.name }}
                      </a-descriptions-item>
                      <a-descriptions-item label="尺码">
                        {{ item.size }}
                      </a-descriptions-item>
                      <a-descriptions-item label="价格">
                        {{ item.productAmtActual }}
                      </a-descriptions-item>

                      <a-descriptions-item label="折扣"> {{ item.discount }}</a-descriptions-item>
                      <a-descriptions-item label="购买时间">
                        {{ item.time.split(' ')[0] }}
                      </a-descriptions-item>
                    </a-descriptions>
                  </div>
                </div>
                <div>浏览 5 次，共 20 秒</div>
                <div style="margin:8px 0 0px 76px;">
                  <a-button type="primary" ghost class="threebtn2" @click="showRecommend(item)">推荐搭配</a-button>
                  <a-button type="primary" ghost class="threebtn2" @click="showsimilarGoods(item)">相似商品</a-button>
                  <a-button type="primary" class="threebtn" @click="sendcard(item.coverPicture, item.goodName)">发送</a-button>
                </div>
              </a-list-item>
            </a-list>
          </div>
          <a-divider />
          <div id="comp-box">
            <div class="section-title">
              <img src="../../assets/record.png" class="edit-icon" />
              <span class="icon-title">交易记录</span>
            </div>
            <a-form v-if="orderList.length > 0 || brandtext != ''">
              <a-form-item label="偏好统计">
                <a-select @change="selectBrandlist" placeholder="全部" v-model="brandtext">
                  <a-select-option :value="item.code" v-for="(item, index) in brandList" :key="index">{{ item.text }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-form>

            <a-list class="demo-loadmore-list order-list" :loading="loading" item-layout="horizontal" :data-source="orderList">
              <div v-if="showLoadingMore" slot="loadMore" :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
                <a-spin v-if="loadingMore" />
                <a v-else @click="onLoadMore"> 加载更多 </a>
              </div>
              <a-list-item slot="renderItem" slot-scope="item, index" :key="index">
                <div style="display:flex;">
                  <div class="img-box">
                    <p class="tagType blue" v-if="item.type == 2">退货</p>
                    <img :src="item.imgUrl ? item.imgUrl : 'https://img.bzhz.jnbygroup.com/cloth.png'" class="order-img" @click="open(item)" />
                    <a-tag color="orange">{{ item.channel }}</a-tag>
                  </div>
                  <div style="overflow: hidden">
                    <a-tooltip placement="topLeft">
                      <template slot="title">
                        <span v-if="item.brand">【{{ item.brand }}】</span> <span>{{ item.goodsName }} </span>
                      </template>
                      <h3 class="commodity—title">
                        <span v-if="item.brand">【{{ item.brand }}】</span> {{ item.goodsName }}
                      </h3>
                    </a-tooltip>
                    <a-descriptions :column="2" class="transaction">
                      <a-descriptions-item label="款号">
                        {{ item.name }}
                      </a-descriptions-item>
                      <a-descriptions-item label="尺码">
                        {{ item.size }}
                      </a-descriptions-item>
                      <a-descriptions-item label="价格">
                        {{ item.productAmtActual }}
                      </a-descriptions-item>

                      <a-descriptions-item label="折扣"> {{ item.discount }}</a-descriptions-item>
                      <a-descriptions-item label="购买时间">
                        {{ item.time.split(' ')[0] }}
                      </a-descriptions-item>
                    </a-descriptions>
                  </div>
                </div>
              </a-list-item>
            </a-list>
          </div>
          <a-divider />
          <div id="components-demo">
            <div style="margin-bottom:12px">
              <img src="../../assets/member.png" class="edit-icon" />
              <span class="icon-title">会员权益</span>
            </div>
            <!-- <a-descriptions :column="2" class="condition-container" > -->
            <a-descriptions :column="1" class="condition-container">
              <!-- <a-descriptions-item ></a-descriptions-item> -->
              <a-descriptions-item label="可用优惠券">
                <div v-if="disclength == 0">暂无可用券</div>
                <div v-if="disclength > 2">
                  <a class="volume" @click="seeClick">查看更多TA的券</a>
                  <a-icon type="right" style="color: #98999b" />
                </div>
              </a-descriptions-item>
            </a-descriptions>
            <DiscountModal ref="DiscountModal" :discountList="discountList" class="discountwrap" :interceptList="interceptList"></DiscountModal>
          </div>
        </div>
        <div class="handle-left" :style="{ left: 0, top: '18px', background: 'transparent' }">
          <a-anchor :affix="false" :getContainer="gerGood" @click="anchorClick" :bounds="100">
            <a-anchor-link :href="item.herf" :title="item.title" class="handle-item" v-for="(item, index) in informationlist" :key="index" />
          </a-anchor>
        </div>
      </a-layout-sider>
    </a-layout>
    <BigImg :visibleImgs="visibleImgs" :imgList="imgList" :goToIndex="goToIndex" @closeBig="closeBig"></BigImg>
    <!-- <GoodInfo :infoVisible="infoVisible" :proInfo="proInfo" :infoType="infoType" @closeInfo="closeInfo"></GoodInfo> -->
    <!-- 商品详情 -->
    <goodInfoModal ref="goodInfoModal" @sendProduct="sendProduct" :weid="weid" :isBox="false" :modalWidth="'80vw'"></goodInfoModal>
    <!-- 推荐LOOK -->
    <!-- @refreshShoppingCart="updateShoppingCart" -->
    <recommend-look-draw ref="recommendLookDraw" @sendLook="sendLook" :storeId="'417608-31066'" :isLookId="false" :isBox="false" :unionId="unionId" />
    <!-- 相似商品 -->
    <!-- @refreshShoppingCart="updateShoppingCart"  -->
    <!-- 相似商品 -->
    <similar-goods-draw
      ref="similarGoodsDraw"
      @sendProduct="sendProduct"
      :weid="weid"
      :showSpuStock="true"
      :isBox="false"
      :storeId="'417608-31066'"
      :unionId="unionId"
      :addProduct="false"
    ></similar-goods-draw>
  </div>
</template>
<script>
// import draggable from 'vuedraggable'
// import Look from './module/look'
// import Goods from './module/goods'
// import Product from './module/product'
import BigImg from '@/views/box/components/UserMsg/bigImg'
import DiscountModal from '@/views/witharound/components/discount/DiscountModal'
// import GoodInfo from './module/goodInfo.vue'
import RecommendLookDraw from '@/views/box/workbench/fashioner/module/RecommendLookDraw'
import similarGoodsDraw from '@/views/box/workbench/fashioner/module/similarGoodsDraw'
import { batchGetProductPromotionPrice } from '@/api/box/api'
import {
  // findStylingCart,
  // deleteStylingCart,
  // changeStylingCartSort,
  selectById,
  getGroupOrder,
  // initStylingCart,
  queryStylingTpl,
  // findMsg,
  // getCustomerAskBoxInfo,
  // querySkus,
  // insertRemark,
  // batchTagsByUnionIdAndskc,
  // saveCustomer,
  getVouchersById,
  // queryStock,
  // updateStylingCart,
  // deleteStylingDetail,
  getMemberConsumeInfo,
  getMemberRecentBrowse,
  getMemberRecentBrowseing,
  getMemberCoupon,
  batchTagsByUnionIdAndskc
} from '@/api/box/workbench'
import Vue from 'vue'
import { USER_INFO } from '@/store/mutation-types'
import { mapActions, mapState } from 'vuex'
import { triggerWindowResizeEvent } from '@/utils/util'
// import Address from './module/address'
// import AddressEdit from '@/views/box/components/Address/AddressEdit.vue'
// import GoodInfoModal from './components/GoodInfoModal'
import GoodInfoModal from '@/views/box/components/GoodInfoModal'
import { mixinDevice } from '@/utils/mixin.js'
import { lookMixin, sendCardMixin } from './mixin.js'
// import getItem$ from 'dingtalk-jsapi/api/util/domainStorage/getItem'
import OrderItem from '@/views/witharound/components/OrderItem.vue'

import { sevenFishDetails, sevenFishOrder } from '@/api/box/qiyuCustomerService'
export default {
  mixins: [mixinDevice, lookMixin, sendCardMixin],
  data() {
    return {
      orderDetails: {},
      productOrderList: [], // 订单记录
      initData: {
        visibleAddList: false,
        unionId: this.$route.params.unionId,
        defLogistic: null
      },
      brandList: [
        { text: '全部', code: '' },
        { text: 'JNBY', code: '2' },
        { text: 'LESS', code: '5' },
        { text: 'CROQUIS', code: '3' },
        { text: 'A PERSONAL NOTE 73', code: '57' },
        { text: 'JNBYHOME', code: '17' },
        { text: 'POMME DE TERRE', code: '12' },
        { text: '童装', code: '4' }
      ],

      targetOffset: undefined,
      currentIndex: 0,
      data: [],
      modalText: '',
      modalType: '',
      memberRemark: '', // 会员备注
      meRemark: '', // 我的备注
      height: '', // 身高
      weight: '', // 体重
      visible: false,
      falg: true,
      collapsedLeft: false,
      collapsedRight: false,
      visible: false,
      visible2: false,
      queryParam: {},
      cartList: [],
      informationlist: [
        { title: '基本信息', herf: '#components' },
        { title: '正在咨询', herf: '#components-product' },
        { title: '近期订单', herf: '#components-order' },
        { title: '购物车', herf: '#components-shopping' },
        { title: '交易记录', herf: '#comp-box' },
        { title: '会员权益', herf: '#components-demo' }
      ], // 会员信息
      userInfo: Vue.ls.get(USER_INFO),

      //   unionId: this.$route.params.unionId, // oZpUxs1utN7-JLtQAD5AMcW_nIPM
      outNo: this.$route.params.outNo == 'getstyle' ? '' : this.$route.params.outNo,
      customerInfo: {
        details: {},
        customerInfoForAnswer: {},
        bcustomerPreferenceInfo: {
          category: '',
          color: '',
          textureOfMaterial: '',
          style: ''
        }
      },
      memberInfo: {},
      defLogistic: {},
      hasLogistic: null,
      visibleImgs: false,
      imgList: [],
      goToIndex: 0,
      orderList: [], // 交易记录
      recentBrowseList: [], //最近浏览列表
      shoppCarting: [], //购物车
      recentBrowseing: [], //正在浏览商品
      pageNo: 1,
      pageNo2: 1,
      pageNo3: 1,
      orderPageNo: 1,
      orderLoading: true,
      loading: true,
      loading2: true,
      loading3: false,
      loadingMore: false,
      loadingOrderMore: false,
      showLoadingOrderMore: true,
      showLoadingMore: true,
      loadingMore2: false,
      loadingMore3: false,
      showLoadingMore2: true,
      showLoadingMore3: false,
      lookData: [],
      singleData: [],
      productList: [], // productId集合
      infoVisible: false, // 商品弹窗
      proInfo: {
        skus: [{ imgurl: '' }]
      }, // 商品信息obj
      infoType: '', // 商品分类来源
      collapsedSider: !this.$store.state.app.sidebar.opened,
      gender: null, // 根据性别，判断商品库默认勾选品牌
      scrollTop: '',
      genderType: {
        0: '女',
        1: '男'
      },
      wantBox: {
        boxRemark: null,
        customerStyleImgs: [],
        dealBoxNum: null,
        expectConnect: null,
        expectProduct: '',
        expectTheme: [],
        leaveMsg: null,
        sendBoxNum: null
      },
      visibleAddList: false,
      totPrice: 0,
      totPromotionPrice: 0,
      discountList: [],
      interceptList: [],
      disclength: 0,
      dealerBrandList: [],
      pageSize: 3,
      storeId: '',
      brandtext: '', //偏好统计
      couponList: [] // 生日优惠券
    }
  },
  components: {
    // Look,
    // Goods,
    // Product,
    BigImg,
    // GoodInfo,
    // draggable,
    DiscountModal,
    // Address,
    // AddressEdit,
    GoodInfoModal,
    RecommendLookDraw,
    similarGoodsDraw,
    OrderItem
  },
  computed: {
    myQiyuCustomer() {
      return JSON.parse(this.$route.query.qiyuCustomer)
    }
  },
  watch: {
    $route(to) {
      console.log(to.path)
      this.getUnionidOutid()
    },

    device(value) {
      console.log('device', value)
    }
  },
  beforeRouteLeave(to, from, next) {
    this.$destroy()
    next()
  },
  created() {
    // this.sideBarToggle()
    // this.initStylingCart()
    this.getSevenFishDetails()
    this.getSevenFishOrder()
  },
  mounted() {
    const that = this
    this.getInfo()
    // this.fetchLookList()
    // if (this.outNo != '') {
    // //   this.getCustomerDefLogistic()
    // } else {
    // this.fetchAddressList()
    // }
  },
  methods: {
    onSendOrderCard(v) {
      // const {url, orderCode} = v
      this.sendOrderCard(v)
    },
    // 近期订单详情
    getSevenFishDetails() {
      const {crm_weid, crm_wid, crm_orderId} = this.myQiyuCustomer
      if (!crm_orderId) return
      const data = {
        brandId: crm_weid, // 15, // 
        userId: crm_wid, // 2678243792,// 
        orderCode: crm_orderId
      }
      sevenFishDetails(data).then(res => {
        if (res.code === 200) {
          this.recentBrowseing = res.data
        } else {
          this.$message.error(res.msg || res.message)
        }
      })
    },

    // 近期订单分页
    onLoadOrderMore() {
      this.loadingOrderMore = true
      this.orderPageNo += 1
      this.getSevenFishOrder()
    },

    // 近期订单
    getSevenFishOrder() {
      const {crm_weid, crm_wid} = this.myQiyuCustomer
      const data = {
        current: this.orderPageNo,
        size: 4,
        brandId: crm_weid, // 15, // 
        userId: crm_wid // 2678243792// 
      }
      return sevenFishOrder(data)
        .then(res => {
          const {records, total} = res.data
          if (res.code === 200) {
            this.productOrderList = this.productOrderList.concat(records)
            this.loadingOrderMore = false
            // this.pageSize = 10
            if (total == this.productOrderList.length) {
              this.showLoadingOrderMore = false
            } else {
              if (this.productOrderList.length > 0) {
                this.showLoadingOrderMore = true
              }
            }
          } else {
            this.$message.error(res.msg || res.message)
          }
          this.orderLoading = false
          if (this.productOrderList.length === 0) {
            this.showLoadingOrderMore = false
          }
        })
        .catch(err => {
          console.log('近期订单:' + err)
        })
    },

    anchorClick(e) {
      e.preventDefault()
    },
    gerGood() {
      return document.getElementById('goods')
    },
    // 查看商品信息
    open(item) {
      console.log(item)
      this.$refs.goodInfoModal.show(item.productId, item.skuId)
    },
    // 发送商品，单个——商品库
    sendProduct(item) {
      this.sendcard(item.cover_imgs, item.value, item.weiMoProductId, item.promotionPrice)
    },
    sendLook(item) {
      this.sendLookCard(item.img, item.title, item.id, item.num)
    },

    // 关闭地址modal
    // closeAddress(value) {
    //   this.initData.visibleAddList = value
    // },
    // 刷新地址列表
    // refreshList(value) {
    //   if (value) {
    //     this.fetchAddressList()
    //   }
    // },
    // 查看顾客地址列表
    // fetchAddressList() {
    //   selectLogistics(this.unionId)
    //     .then(res => {
    //       if (res.code === 0) {
    //         let data = res.data
    //         if (data.length > 0) {
    //           this.hasLogistic = true
    //           let result = data.filter(e => e.logDefault == 1)
    //           if (result.length > 0) {
    //             this.defLogistic = result[0]
    //             this.initData.defLogistic = result[0]
    //           } else {
    //             this.defLogistic = data[0]
    //             this.initData.defLogistic = data[0]
    //           }
    //         } else {
    //           this.hasLogistic = false
    //         }
    //       } else {
    //         this.$message.error(res.data)
    //       }
    //     })
    //     .catch(err => {
    //       console.log('查看顾客地址列表:' + err)
    //     })
    // },
    // 获取默认要盒地址
    // getCustomerDefLogistic() {
    //   getCustomerDefLogistic(this.outNo, this.unionId)
    //     .then(res => {
    //       if (res.code === 0) {
    //         if (res.data != null) {
    //           this.defLogistic = res.data
    //           this.initData.defLogistic = res.data
    //         } else {
    //           this.fetchAddressList()
    //         }
    //       } else {
    //         this.$message.error(res.msg)
    //       }
    //     })
    //     .catch(err => {
    //       console.log('获取默认要盒地址：' + err)
    //     })
    // },
    // newAddress(value) {
    //   if (value) {
    //     this.defLogistic = value
    //     this.initData.defLogistic = value
    //   } else {
    //     // this.getCustomerDefLogistic()
    //   }
    // },
    dealerBrand(value) {
      this.dealerBrandList = value
      this.getCusInfo()
    },
    showModal(type) {
      switch (type) {
        case 'memberRemark':
          this.modalText = '编辑会员备注'
          this.modalType = 'memberRemark'
          this.memberRemark = this.customerInfo.details.bgRemark
          break
        case 'meRemark':
          this.modalText = '编辑我的备注'
          this.modalType = 'meRemark'
          this.meRemark = this.wantBox.boxRemark
          break
        case 'shape':
          this.modalText = '编辑身高/体重'
          this.modalType = 'shape'
          this.height = this.customerInfo.customerInfoForAnswer.height == '-' ? '' : this.customerInfo.customerInfoForAnswer.height
          this.weight = this.customerInfo.customerInfoForAnswer.weight == '-' ? '' : this.customerInfo.customerInfoForAnswer.weight
          break
      }
      setTimeout(() => {
        this.visible = true
      }, 200)
    },
    async querySkuAndStock(item, type) {
      // console.log(item)
      if (item.skus.length == 0) {
        await this.querySku(item)
      }
      if (type == 'size') {
        let skusForColor = item.skus.filter(e => e.colorno == item.colorNo)
        let skuIds = skusForColor.map(i => i.id)
        let stockList = await this.fetchStock(skuIds)
        for (let sku of item.skus) {
          let result = stockList.filter(k => k.skuId == sku.id)
          if (result.length > 0) {
            sku.stock = result[0].stock > 0 ? result[0].stock : 0
          }
        }
      }
    },
    // 查询商品所有SKU
    querySku(item) {
      if (item.skus.length === 0) {
        const data = {
          requestData: {
            productId: item.productId
          }
        }
        return querySkus(data)
          .then(res => {
            if (res.code === 0) {
              if (res.data.length > 0) {
                item.skus = res.data
                const colors = this.filterSizeColor(res.data, item.colorList, 'color')
                item.colorList = colors
                const sizes = this.filterSizeColor(res.data, item.sizeList, 'size')
                item.sizeList = sizes
              }
              console.log(item, 'item')
            }
          })
          .catch(err => {
            console.log('查询商品所有SKU:' + err)
          })
      }
    },
    // 选择颜色尺码
    selectColor(value, record) {
      // console.log(value, record)
      if (record.sizeNo && record.sizeName) {
        let defaultSize = {
          sizeNo: record.sizeNo,
          sizeName: record.sizeName,
          colorNo: record.colorNo,
          colorName: record.colorName
        }
        record.defaultSize = defaultSize
      }

      record.colorNo = value
      record.colorName = record.colorList.filter(e => e.colorno == value)[0].color_name
      record.sizeNo = ''
      record.sizeName = ''

      console.log(record)
      /* const colorsize = value + record.sizeNo
      // this.checkExistGood(record, colorsize)
      this.checkSku(colorsize, record) */
    },
    selectSize(value, record) {
      if (record.sizeNo && record.sizeName) {
        let defaultSize = {
          sizeNo: record.sizeNo,
          sizeName: record.sizeName,
          colorNo: record.colorNo,
          colorName: record.colorName
        }
        record.defaultSize = defaultSize
      }

      if (value == record.defaultSize.sizeNo && record.colorNo == record.defaultSize.colorNo) {
        record.sizeNo = record.defaultSize.sizeNo
        record.sizeName = record.sizeList.filter(e => e.sizeno == value)[0].size_name
        delete record.defaultSize
        return
      }
      const colorsize = record.colorNo + value
      // this.checkExistGood(record, colorsize)
      this.checkSku(colorsize, record)
    },
    // 确认look中是否含有要修改的商品
    /* checkExistGood(record, colorsize) {
      const cartSkuId = record.skuId
      var emptyList = []
      for (var i = 0; i < this.lookData.length; i++) {
        const stylings = JSON.parse(JSON.stringify(this.lookData[i].stylings))
        if (stylings.length > 0) {
          // look中含商品
          const result = stylings.filter(item => item.skuId === cartSkuId.toString())
          if (result.length > 0) {
            // 含有购物车要修改的商品
            const index = stylings.indexOf(result[0])
            this.$message.warning('请先删除LOOK/单品中对应的商品，再进行修改！', 2)
            emptyList = emptyList.concat(stylings)
          }
        } else {
          emptyList = emptyList.concat(stylings)
        }
      }
      if (emptyList.length === 0) {
        this.checkSku(colorsize, record)
      }
    }, */
    // 查询对应sku
    async checkSku(colorsize, record) {
      try {
        console.log(this.cartList)
        // 查询对应sku
        const result = record.skus.filter(item => item.no.includes(colorsize))
        const stock = await this.fetchStock([result[0].id])
        // 检查商品是否有重复
        const goods = this.cartList.filter(item => item.skuId.toString() === result[0].id)
        if (goods.length === 0) {
          if (stock[0].stock > 0) {
            this.updateStylingCart(result[0], record, stock[0].stock)
          } else {
            this.$message.warning('该尺码库存为0！')
          }
        } else {
          this.$message.warning('已存在商品！')
        }
      } catch (err) {
        console.log(err)
      }
    },
    // 修改购物车商品
    updateStylingCart(goods, record, stock) {
      let respList = []
      if (record.respList && record.respList.length > 0) {
        respList = record.respList.map(item => {
          const newItem = {
            colorName: goods.color_name,
            colorNo: goods.colorno,
            imgUrl: goods.imgurl,
            productCode: item.productCode,
            productId: item.productId,
            productName: item.productName,
            sizeName: goods.size_name,
            sizeNo: goods.sizeno,
            skuId: goods.id,
            skuCode: goods.no,
            sorted: item.sorted,
            stylingBaseId: item.stylingBaseId,
            id: item.id
          }
          return newItem
        })
      }
      const data = {
        requestData: {
          colorName: goods.color_name,
          colorNo: goods.colorno,
          id: record.id,
          imgUrl: goods.imgurl,
          sizeName: goods.size_name,
          sizeNo: goods.sizeno,
          skuCode: goods.no,
          skuId: goods.id,
          unionId: this.unionId,
          list: respList
        },
        user_id: this.userInfo.id
      }
      updateStylingCart(data)
        .then(res => {
          if (res.code === 0) {
            record.colorName = goods.color_name
            record.colorNo = goods.colorno
            record.imgUrl = goods.imgurl
            record.sizeName = goods.size_name
            record.sizeNo = goods.sizeno
            record.skuCode = goods.no
            record.skuId = goods.id
            record.stock = stock
            this.getBatchTags()
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('修改购物车商品:' + err)
        })
    },
    // 筛选颜色尺码组
    filterSizeColor(data, list, type) {
      switch (type) {
        case 'color':
          const tempArr = list.map(item => item.colorno)
          const colors = data.map(item => {
            const color = {
              color_name: item.color_name,
              colorno: item.colorno
            }
            return color
          })
          for (var i = 0; i < colors.length; i++) {
            var temp = colors[i]
            if (tempArr.indexOf(temp.colorno) === -1) {
              tempArr.push(temp.colorno)
              list.push(temp)
            }
          }
          return list
        case 'size':
          const tempArr2 = list.map(item => item.sizeno)
          const sizes = data.map(item => {
            const size = {
              size_name: item.size_name,
              sizeno: item.sizeno
            }
            return size
          })
          for (var j = 0; j < sizes.length; j++) {
            var temp2 = sizes[j]
            if (tempArr2.indexOf(temp2.sizeno) === -1) {
              tempArr2.push(temp2.sizeno)
              list.push(temp2)
            }
          }
          list.sort(this.compare('sizeno'))
          return list
      }
    },
    // 尺码排序
    compare(property) {
      return function(a, b) {
        var value1 = a[property]
        var value2 = b[property]
        return value1 - value2
      }
    },
    handleOk() {
      switch (this.modalType) {
        case 'memberRemark':
          this.editCustomer()
          break
        case 'meRemark':
          this.insertRemark()
          break
        case 'shape':
          this.editCustomer()
          break
      }
    },
    // 修改要盒备注
    insertRemark() {
      insertRemark(this.outNo, this.meRemark)
        .then(res => {
          if (res.code === 0) {
            this.$message.success('修改成功')
            this.getWantBox()
            this.visible = false
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('要盒需求信息：' + err)
        })
    },
    // 修改身高/体重或者备注
    editCustomer() {
      let params = {}
      if (this.modalType == 'memberRemark') {
        params = {
          requestData: {
            bgRemark: this.memberRemark,
            id: this.customerInfo.details.id
          }
        }
      } else {
        params = {
          requestData: {
            height: this.height,
            weight: this.weight,
            id: this.customerInfo.details.id
          }
        }
      }

      saveCustomer(params)
        .then(res => {
          if (res.code === 0) {
            this.getCusInfo()
            this.$message.success('修改成功')
            this.visible = false
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('要盒身高/体重：' + err)
        })
    },

    seeClick() {
      this.$refs.DiscountModal.open()
    },
    // ...mapActions(['setSidebar']),
    // sideBarToggle() {
    //   this.setSidebar(false)
    //   triggerWindowResizeEvent()
    // },
    getUnionidOutid() {
      this.unionId = this.$route.params.unionId
      console.log(this.$route.params.unionId)
      this.outNo = this.$route.params.outNo == 'getstyle' ? '' : this.$route.params.outNo
    },
    userTabsChange(key) {
      // console.log(key)
    },
    goodsTabsChange(key) {
      console.log(key)
    },
    handleRight() {
      this.collapsedRight = !this.collapsedRight
    },
    handleLeft() {
      this.collapsedLeft = !this.collapsedLeft
    },
    // 前往搭配页面
    toColl() {
      if (this.cartList.length > 0) {
        this.$router.push(`/box/workbench/fashioner/collocation/${this.unionId}/${this.$route.params.outNo}`)
      } else {
        this.$message.warning('请选择商品！')
      }
    },
    // 初始化购物车（for主题搭配）
    initStylingCart() {
      const data = {
        requestData: {
          customerAskId: this.outNo
        },
        user_id: this.userInfo.id
      }
      initStylingCart(data)
        .then(res => {
          if (res.code === 0) {
            this.fetchShoppingCart()
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('初始化购物车:' + err)
        })
    },
    // 查询商品库存
    fetchStock(skus) {
      const data = {
        requestData: {
          skuIds: skus
        }
      }
      return queryStock(data)
        .then(res => {
          if (res.code === 0) {
            return res.data
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('fetchStock:' + err)
        })
    },
    // 获取购物车数据
    // fetchShoppingCart() {
    //   const data = {
    //     requestData: {
    //       unionId: this.unionId,
    //       outNo: this.outNo
    //     },
    //     user_id: this.userInfo.id
    //   }
    //   findStylingCart(data)
    //     .then(async res => {
    //       if (res.code === 0) {
    //         res.data.forEach(item => {
    //           item.price = item.price ? Number(item.price).toFixed(2) : 0
    //           item.productPrice = item.productPrice ? Number(item.productPrice).toFixed(2) : 0
    //         })
    //         const skus = res.data.map(item => {
    //           return item.skuId
    //         })
    //         if (res.data.length != 0) {
    //           this.stockList = await this.fetchStock(skus)

    //           for (var i = 0; i < res.data.length; i++) {
    //             res.data[i].skus = []
    //             res.data[i].colorList = []
    //             res.data[i].colorList.push({
    //               color_name: res.data[i].colorName,
    //               colorno: res.data[i].colorNo
    //             })
    //             res.data[i].sizeList = []
    //             res.data[i].sizeList.push({
    //               size_name: res.data[i].sizeName,
    //               sizeno: res.data[i].sizeNo
    //             })
    //             const arr = this.stockList.filter(value => {
    //               if (value.skuId === res.data[i].skuId) {
    //                 return value
    //               }
    //             })
    //             res.data[i].stock = arr[0].stock
    //           }

    //           this.cartList = res.data
    //           this.getBatchTags() // 查询标签接口
    //           const spuList = this.cartList.map(e => {
    //             return { spuId: e.productId }
    //           })
    //           if (spuList.length > 0) {
    //             this.getProductPromotionPrice(spuList)
    //           } else {
    //             this.totPromotionPrice = 0
    //             this.totPrice = 0
    //           }
    //         }
    //       } else {
    //         this.$message.error(res.msg)
    //       }
    //     })
    //     .catch(err => {
    //       console.log('购物车:' + err)
    //     })
    // },
    // getProductPromotionPrice(list) {
    //   let data = {
    //     requestData: {
    //       productList: list,
    //       unionId: this.unionId
    //     },
    //     user_id: this.userInfo.id
    //   }
    //   batchGetProductPromotionPrice(data)
    //     .then(res => {
    //       if (res.code == 0) {
    //         this.cartList = this.cartList.map((item, index) => {
    //           let promotionPrice = res.data.productList[index].promotionPrice.toFixed(2)
    //           return { promotionPrice, ...item }
    //         })
    //         this.totPrice = res.data.totPrice
    //         this.totPromotionPrice = res.data.totPromotionPrice
    //       } else {
    //         this.$message.error(res.msg)
    //       }
    //     })
    //     .catch(err => {
    //       console.log('ProductPromotionPrice:' + err)
    //     })
    // },
    // 刷新购物车
    // updateShoppingCart(value) {
    //   if (value) {
    //     this.fetchShoppingCart()
    //   }
    // },
    // 删除购物车商品
    // async deleteCart(id, index, item) {
    //   try {
    //     await this.queryStylingTpl()
    //     this.checkStylingGood(id, index, item)
    //   } catch (err) {
    //     console.log(err)
    //   }
    // },
    // 查询look列表
    // async fetchLookList() {
    //   try {
    //     const stylingResult = await this.queryStylingTpl()
    //     if (stylingResult.code === 0) {
    //       this.lookData = []
    //       this.singleData = []
    //       for (var i = 0; i < stylingResult.data.length; i++) {
    //         if (stylingResult.data[i].type === 2) {
    //           this.singleData.push(stylingResult.data[i])
    //         } else {
    //           this.lookData.push(stylingResult.data[i])
    //         }
    //       }

    //       if (this.singleData.length > 0) {
    //         this.lookData.push(this.singleData[0])
    //       }

    //       this.loading = false
    //     } else {
    //       this.$message.error(stylingResult.msg)
    //       this.loading = false
    //     }
    //   } catch (err) {
    //     console.log(err)
    //   }
    // },
    // 查询look列表
    // queryStylingTpl() {
    //   if (this.lookData.length <= 0) {
    //     const data = {
    //       page: {
    //         pageNo: 1,
    //         pageSize: 100
    //       },
    //       requestData: {
    //         outNo: this.outNo,
    //         unionId: this.unionId
    //       },
    //       user_id: this.userInfo.id
    //     }
    //     return queryStylingTpl(data)
    //       .then(res => {
    //         if (res.code === 0) {
    //           this.lookData = res.data
    //         } else {
    //           this.$message.error(res.msg)
    //         }
    //         return res
    //       })
    //       .catch(err => {
    //         console.log('查询look列表:' + err)
    //       })
    //   } else {
    //     console.log(this.lookData)
    //   }
    // },
    // getEl() {
    //   return document.getElementById('goods')
    // },
    // 确认look中是否含有要删除的商品
    // checkStylingGood(id, index, record) {
    //   const cartSkuId = record.skuId
    //   // console.log(cartSkuId, this.lookData)
    //   // var emptyList = []
    //   for (var i = 0; i < this.lookData.length; i++) {
    //     const stylings = JSON.parse(JSON.stringify(this.lookData[i].stylings))
    //     if (stylings.length > 0) {
    //       // look中含商品
    //       const result = stylings.filter(item => item.skuId === cartSkuId.toString())
    //       if (result.length > 0) {
    //         // 含有购物车要删除的商品
    //         const index = stylings.indexOf(result[0])
    //         // this.$message.warning('请先删除LOOK/单品中对应的商品！', 2)
    //         // emptyList = emptyList.concat(stylings)
    //         this.deleteStylingDetail(result[0].id)
    //       }
    //     }
    //   }
    //   // else {
    //   //     emptyList = emptyList.concat(stylings)
    //   //   }
    //   // }
    //   // console.log(emptyList)
    //   // if (emptyList.length === 0) {
    //   this.deleteShoppingCart(id, index)
    //   // }
    // },
    // 删除搭配明细
    // deleteStylingDetail(id) {
    //   this.getDiscount = false
    //   const data = {
    //     requestData: {
    //       id: id
    //     },
    //     user_id: this.userInfo.id
    //   }
    //   deleteStylingDetail(data)
    //     .then(res => {
    //       if (res.code === 0) {
    //         this.$message.success('商品删除成功！')
    //       } else {
    //         this.$message.error(res.msg)
    //       }
    //     })
    //     .catch(err => {
    //       console.log('删除搭配明细:' + err)
    //     })
    // },
    // 购物车删除
    // deleteShoppingCart(id, index) {
    //   console.log(id)
    //   const data = {
    //     requestData: {
    //       id: id
    //     },
    //     user_id: this.userInfo.id
    //   }
    //   deleteStylingCart(data)
    //     .then(res => {
    //       if (res.code === 0) {
    //         this.$message.success('购物车商品删除成功！')
    //         this.cartList.splice(index, 1)
    //         const spuList = this.cartList.map(e => {
    //           return { spuId: e.productId }
    //         })
    //         if (spuList.length > 0) {
    //           this.getProductPromotionPrice(spuList)
    //         } else {
    //           this.totPrice = 0
    //           this.totPromotionPrice = 0
    //         }
    //         // this.fetchShoppingCart()
    //       } else {
    //         this.$message.error(res.msg)
    //       }
    //     })
    //     .catch(err => {
    //       console.log('搭盒商品购物车删除:' + err)
    //     })
    // },
    // 会员信息
    async getInfo() {
      await this.getCusInfo() // 用户信息
      await this.getMemberCoupon() // 七鱼会员优惠券信息
      await this.getVouchers() // 生日优惠卷信息
      await this.getMemberRecentBrowse()
      await this.getGroupOrder()
      await this.getMemberRecentBrowsedata()
      await this.getMemberConsumeInfo() // 七鱼会员信息
      // await this.vouchersList() // 优惠卷信息

      //   if (this.outNo != '') {
      //     // 主动要盒
      //     await this.getWantBox() // 要盒信息

      //     // 根据性别，判断商品库默认勾选品牌
      //     let result = await this.checkMsg()
      //     if (result.code == 0) {
      //       this.gender = result.data.customerAskBox.cusGender

      //       return
      //     } else {
      //       this.$message.warning(result.msg)
      //     }
      //   }
      this.gender = this.customerInfo.details.gender != null ? this.customerInfo.details.gender : -1
    },
    // 获取要盒信息
    // getWantBox() {
    //   let params = {
    //     id: this.outNo
    //   }
    //   return getCustomerAskBoxInfo(params)
    //     .then(res => {
    //       if (res.code === 0) {
    //         let arry = []
    //         if (res.data.customerStyleImgs) {
    //           res.data.customerStyleImgs.forEach(item => {
    //             arry.push({ value: item })
    //           })
    //         }
    //         this.wantBox = res.data || this.wantBox
    //         this.wantBox.customerStyleImgs = arry
    //       } else {
    //         this.$message.error(res.msg)
    //       }
    //     })
    //     .catch(err => {
    //       console.log('要盒需求信息：' + err)
    //     })
    // },
    // 获取生日优惠卷信息
    getVouchers() {
      return getVouchersById(this.unionId)
        .then(res => {
          if (res.code === 0) {
            this.couponList = res.data
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('优惠卷信息：' + err)
        })
    },

    // 获取七鱼优惠券信息
    getMemberCoupon() {
      let data = {
        page: {
          pageNo: 1,
          pageSize: 100
        },
        requestData: {
          weId: this.weid,
          unionId: this.unionId
        }
      }
      return getMemberCoupon(data)
        .then(res => {
          if (res.code === 0) {
            console.log(res)
            this.discountList = res.data
            this.disclength = res.data.length
            this.discountList.forEach(ele => {
              // ele.startDate = ele.startDate ? ele.startDate.replace(/(\d{4})(\d{2})(\d{2})/, '$1.$2.$3') : ''
              // ele.validDate = ele.validDate ? ele.validDate.replace(/(\d{4})(\d{2})(\d{2})/, '$1.$2.$3') : ''
              // ele.vouDis = ele.vouDis ? (ele.vouDis * 10).toFixed(1) : ''
              ele.falg = false // 判断箭头方向以及提示
            })
            if (this.discountList && this.discountList.length > 2) {
              this.interceptList = this.discountList.slice(0, 2)
            } else {
              this.interceptList = this.discountList
            }
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('优惠卷信息：' + err)
        })
    },
    // 获取七鱼会员最近浏览的商品列表
    getMemberRecentBrowse() {
      let data = {
        page: {
          pageNo: this.pageNo2,
          pageSize: 10
        },
        requestData: {
          weId: this.weid,
          unionId: this.unionId
        }
      }
      return getMemberRecentBrowse(data)
        .then(res => {
          if (res.code === 0) {
            console.log(res)
            res.data.map(function(item) {
              // item.name
              item.productCode = item.name
              item.colorno = item.colorNo
              if (item.browseTime) {
                item.browseTime = item.browseTime.split(':')[0] + ':' + item.browseTime.split(':')[1]
              }
            })

            this.recentBrowseList = this.recentBrowseList.concat(res.data)
            this.loadingMore2 = false

            // this.pageSize = 10
            if (res.page.pageNo === res.page.pages) {
              this.showLoadingMore2 = false
            }
            if (this.recentBrowseList.length > 0) {
              this.concatList(this.recentBrowseList, 2)
            }
          } else {
            this.$message.error(res.msg)
          }
          this.loading2 = false
          if (this.recentBrowseList.length === 0) {
            this.showLoadingMore2 = false
          }
        })
        .catch(err => {
          console.log('优惠卷信息：' + err)
        })
    },
    // 查询促销价格
    getProductPromotionPrice(list, type) {
      let data = {
        requestData: {
          productList: list,
          unionId: this.unionId
        }
      }
      batchGetProductPromotionPrice(data)
        .then(res => {
          if (res.code == 0) {
            if (type == 2) {
              this.recentBrowseList = this.recentBrowseList.map((item, index) => {
                let promotionPrice = res.data.productList[index].promotionPrice.toFixed(2)
                return { promotionPrice, ...item }
              })
            } else {
              this.recentBrowseing = this.recentBrowseing.map((item, index) => {
                let promotionPrice = res.data.productList[index].promotionPrice.toFixed(2)
                return { promotionPrice, ...item }
              })
            }
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('ProductPromotionPrice:' + err)
        })
    },
    // 获取七鱼会员正在浏览的商品
    getMemberRecentBrowsedata() {
      return getMemberRecentBrowseing(this.qiyuCustomer.crm_goodsId, this.weid)
        .then(res => {
          if (res.code === 0) {
            let data = res.data
            if (data.length > 0) {
              data.forEach(ele => {
                ele.productId = ele.id
              })
              this.concatList(data, 1)
            }
          } else {
            this.$message.error(res.data)
          }
        })
        .catch(err => {
          console.log('查看顾客地址列表:' + err)
        })
    },
    async concatList(dataList, type) {
      // 是否需要调用tag接口
      /****  2022-03-16 Start 平台优化一期  ****/
      let tagList = []
      for (let item of dataList) {
        tagList.push(`${item.name},${item.colorno}`)
      }

      let resultTags = await this.getBatchTags(tagList)
      if (resultTags.code == 0) {
        for (let item of dataList) {
          let tagItem = resultTags.data.filter(e => e.productCode == item.name && e.productColor == item.colorno)[0]
          item.inLook = tagItem.inLook
        }
        console.log(dataList)
        if (type == 1) {
          let arr = []
          arr.push(dataList[0])
          this.recentBrowseing = arr
          const spuList = this.recentBrowseing.map(e => {
            return { spuId: e.id }
          })
          if (spuList.length > 0) {
            this.getProductPromotionPrice(spuList, 1)
          }
        } else if (type == 2) {
          this.recentBrowseList = dataList
          const spuList = this.recentBrowseList.map(e => {
            return { spuId: e.productId }
          })
          if (spuList.length > 0) {
            this.getProductPromotionPrice(spuList, 2)
          }
        }
      } else {
        this.$message.warning(resultTags.msg)
      }
    },
    // 批量查询用户的商品标签
    getBatchTags(list) {
      let data = {
        requestData: {
          productCodesAndColors: list,
          unionId: this.unionId
        }
      }
      return batchTagsByUnionIdAndskc(data).then(res => {
        return res
      })
    },
    // 获取用户信息
    getCusInfo() {
      console.log(this.unionId)

      return selectById(this.unionId, this.qiyuCustomer.crm_cardNo)
        .then(res => {
          if (res.code === 0) {
            this.getLine(res.data.customerInfoForAnswer)
            let arry = []
            if (res.data.lifePhotos) {
              res.data.lifePhotos.forEach(item => {
                arry.push({ value: item })
              })
            }
            this.customerInfo = JSON.parse(JSON.stringify(res.data))
            this.customerInfo.age = this.customerInfo.age && this.customerInfo.age > 0 ? this.customerInfo.age : '--'
            this.customerInfo.details.birthday = this.customerInfo.details.birthday ? this.customerInfo.details.birthday : '--'
            this.customerInfo.lifePhotos = arry
            this.customerInfo.integer = this.customerInfo.integer || '-'
            this.customerInfo.details.coin = this.customerInfo.details.coin || '-'
            this.customerInfo.topClass = this.customerInfo.topClass ? this.customerInfo.topClass.toString() : ''
            this.customerInfo.fabric = this.customerInfo.fabric && this.customerInfo.fabric.length > 0 ? this.customerInfo.fabric.toString() : '-'
            if (this.dealerBrandList) {
              this.customerInfo.dealerBrand = Array.from(new Set(this.dealerBrandList.concat(this.customerInfo.dealerBrand)))
            }
            if (res.data.bcustomerPreferenceInfo != null) {
              this.customerInfo.bcustomerPreferenceInfo.category = res.data.bcustomerPreferenceInfo.category ? JSON.parse(res.data.bcustomerPreferenceInfo.category).join(',') : '-'
              this.customerInfo.bcustomerPreferenceInfo.color = res.data.bcustomerPreferenceInfo.color ? JSON.parse(res.data.bcustomerPreferenceInfo.color).join(',') : '-'
              this.customerInfo.bcustomerPreferenceInfo.textureOfMaterial = res.data.bcustomerPreferenceInfo.textureOfMaterial
                ? JSON.parse(res.data.bcustomerPreferenceInfo.textureOfMaterial).join(',')
                : '-'
              this.customerInfo.bcustomerPreferenceInfo.style = res.data.bcustomerPreferenceInfo.style ? JSON.parse(res.data.bcustomerPreferenceInfo.style).join(',') : '-'
            } else {
              this.customerInfo.bcustomerPreferenceInfo = {
                category: '-',
                color: '-',
                textureOfMaterial: '-',
                style: '-'
              }
            }
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('用户信息：' + err)
        })
    },
    // 获取七鱼会员信息
    getMemberConsumeInfo() {
      let data = {
        page: {
          pageNo: 1,
          pageSize: 10
        },
        requestData: {
          weId: this.weid,
          unionId: this.unionId
        }
      }
      return getMemberConsumeInfo(data)
        .then(res => {
          if (res.code === 0) {
            this.memberInfo = res.data
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log('优惠卷信息：' + err)
        })
    },
    getLine(obj) {
      for (let i in obj) {
        if (obj[i] === null) obj[i] = '-'
      }
    },
    // 查看大图
    bigImg(index, list, type) {
      if (type === 'styleList') {
        this.imgList = list.map(item => {
          if (item.img) {
            item.value = item.img
          }
          return item.value
        })
      } else if (type === 'photo') {
        this.imgList = [list]
      }
      this.goToIndex = index
      setTimeout(() => {
        this.visibleImgs = true
      }, 100)
    },
    // 关闭大图
    closeBig(value) {
      this.visibleImgs = value
      setTimeout(() => {
        this.imgList = []
      }, 200)
    },
    // 集团消费记录
    getGroupOrder() {
      const data = {
        page: {
          pageNo: this.pageNo,
          pageSize: 10
        },
        requestData: {
          unionId: this.unionId,
          carcBrandId: this.brandtext
        }
      }
      return getGroupOrder(data)
        .then(res => {
          if (res.code === 0) {
            this.orderList = this.orderList.concat(res.data)
            this.loadingMore = false
            // this.pageSize = 10
            if (res.page.pageNo === res.page.pages) {
              this.showLoadingMore = false
            } else {
              if (this.orderList.length > 0) {
                this.showLoadingMore = true
              }
            }
          } else {
            this.$message.error(res.msg)
          }
          this.loading = false
          if (this.orderList.length === 0) {
            this.showLoadingMore = false
          }
        })
        .catch(err => {
          console.log('集团消费记录:' + err)
        })
    },
    // 根据品牌筛选交易记录
    selectBrandlist(event) {
      console.log(event)
      this.brandtext = event
      this.loading = true
      this.loadingMore = true
      this.pageNo = 1
      this.orderList = []
      this.getGroupOrder()
    },
    onLoadMore() {
      this.loadingMore = true
      this.pageNo += 1
      this.getGroupOrder()
    },
    onLoadMore2() {
      this.loadingMore2 = true
      this.pageNo2 += 1
      this.getMemberRecentBrowse()
    },
    // 查看商品信息
    openInfo(visible, obj, type) {
      console.log(1)
      this.proInfo = obj
      this.infoVisible = visible
      this.infoType = type
    },
    // 关闭商品信息
    closeInfo(value) {
      this.infoVisible = value
      this.proInfo = {
        skus: [{ imgurl: '' }]
      }
      this.infoType = ''
    },
    // 要盒留言
    // checkMsg() {
    //   return findMsg(this.outNo).then(res => {
    //     return res
    //   })
    // },
    // 拖拽确定
    // determine() {
    //   let spuList = this.cartList.map(e => {
    //     return e.id
    //   })
    //   const data = {
    //     requestData: {
    //       ids: spuList
    //     }
    //   }
    //   changeStylingCartSort(data)
    //     .then(res => {
    //       if (res.code === 0) {
    //         this.fetchShoppingCart()
    //         this.falg = true
    //         this.$message.success('修改购物车排序成功')
    //       } else {
    //         this.$message.error(res.msg)
    //       }
    //     })
    //     .catch(err => {
    //       console.log('修改购物车排序:' + err)
    //     })
    // },
    // 拖拽取消
    // cancelOrder() {
    //   this.fetchShoppingCart()
    //   this.falg = !this.falg
    // },
    // 批量查询用户的商品标签
    // getBatchTags() {
    //   let tagList = []
    //   for (let item of this.cartList) {
    //     tagList.push(`${item.productCode},${item.colorNo}`)
    //   }
    //   let data = {
    //     requestData: {
    //       productCodesAndColors: tagList,
    //       unionId: this.unionId
    //     }
    //   }
    //   return batchTagsByUnionIdAndskc(data).then(res => {
    //     this.cartList = this.cartList.map((item, index) => {
    //       let status = res.data[index].status
    //       let inLook = res.data[index].inLook
    //       return { ...item, status, inLook }
    //     })
    //   })
    // },
    // 获取storeId
    // getStoreId(value) {
    //   this.storeId = value
    // },
    // 查看推荐LOOK
    showRecommend(item) {
      console.log(item)
      let good = {
        colorName: item.color_name,
        colorNo: item.colorno,
        productCode: item.name,
        productId: item.id,
        productName: item.value
      }
      this.$refs.recommendLookDraw.show(good)
    },
    // 查看相似商品
    showsimilarGoods(item) {
      console.log(item)
      this.$refs.similarGoodsDraw.show(item)
    }
  }
}
</script>
<style lang="less" scoped src="./style/style.less"></style>
<style lang="less" scoped>
.discountwrap {
  display: flex;
  padding-right: 50px;
  justify-content: space-between;
  flex-wrap: wrap;
}
.memberinfo {
  border: 1px solid #1890ff;
  padding: 10px;
  width: 98%;
  margin-bottom: 20px;
}
.colortext {
  color: #1890ff;
}
.origintext {
  color: #8c8c8c;
  span {
    color: #1890ff;
  }
}
.membertotal {
  span {
    color: #8c8c8c;
    margin-right: 20px;
    i {
      color: #1890ff;
      font-style: initial;
    }
  }
}
.threebtn {
  margin-right: 12px;
}
.threebtn2 {
  font-size: 12px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #595959;
  margin-right: 12px;
  border-radius: 4px;
  border: 1px solid #bfbfbf;
  background: none;
}
/deep/.ant-list-items {
  display: flex;
  flex-wrap: wrap;
}
/deep/.ant-list-item:nth-last-child(2) {
  border-bottom: none;
}
/deep/.ant-form-item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
/deep/.ant-form-item-label {
  width: 70px;
  padding: 0;
}
/deep/.ant-form-item-control-wrapper {
  width: 100px;
}

.tagType {
  font-size: 12px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #ffffff;
  line-height: 22px;
  position: absolute;
  top: 0px;
  left: 0;
  z-index: 2;
  padding: 0 8px;
  &.blue {
    background: #1890ff;
  }
}
.ant-back-top {
  bottom: 100px;
  /deep/.ant-back-top-content {
    background: rgba(0, 0, 0, 0.7);
  }
}
.sider {
  background: white;
  height: 100vh;
  z-index: 5;
  box-shadow: none;
  .brands {
    margin-bottom: 6px;
  }
  .order-list {
    overflow-y: auto;
    padding: 10px 0;
    .ant-list-item {
      display: block;
      align-items: flex-start;
      justify-content: flex-start;
      padding-right: 20px;
    }
    /deep/.ant-list-item:nth-last-child(2) {
      border-bottom: none;
    }
    .img-box {
      text-align: center;
      width: 76px;
      position: relative;
    }
    .order-img {
      width: 64px;
      height: 64px;
      object-fit: scale-down;
      border: 1px dashed #cdcdcd;
      margin-right: 12px;
      margin-bottom: 8px;
      cursor: pointer;
      box-sizing: border-box;
      padding: 4px;
    }
    /deep/ .ant-descriptions-row > th,
    /deep/ .ant-descriptions-row > td {
      padding-bottom: 2px;
      display: initial;
    }
  }
}
.like-theme {
  position: relative;
  display: inline-block;
  width: 54px !important;
  margin-right: 8px;
  p {
    text-align: center;
    position: absolute;
    bottom: -2px;
    width: 54px;
    background: rgba(0, 0, 0, 0.5);
    color: white;
    font-size: 12px;
  }
  .imgs {
    padding: 4px;
  }
}
.imgs {
  width: 54px !important;
  height: 54px !important;
  object-fit: scale-down;
  padding: 10px;
  border: 1px solid #cdcdcd;
  margin-right: 10px;
  margin-bottom: 10px;
  cursor: pointer;
  margin-top: 8px;
}
.sider-left {
  position: fixed;
}
.sider-right {
  right: 0;
  position: fixed;
  overflow: hidden;
  // padding-bottom: 80px;
  // background: pink;
}
.tab-content {
  padding: 16px 24px;
  max-height: 100%;
  overflow-y: auto;
  background: #fff;
}
.handle-left,
.handle-right {
  position: absolute;
  background: #1890ff;
  width: 24px;
  height: 85px;
  border-radius: 4px 0px 0px 4px;
  text-align: center;
  display: flex;
  cursor: pointer;
  flex-direction: column;
  i {
    font-size: 16px;
    color: #fff;
    margin-top: 3px;
  }
  div {
    font-size: 14px;
    font-weight: 400;
    color: #ffffff;
  }
}
.handle-right {
  transition: right 0.2s;
  border-radius: 4px 0 0 4px;
  height: 80px;
  padding: 4px 0px;
  div {
    line-height: 16px;
  }
}
.handle-left {
  transition: left 0.2s;
  border-radius: 0 4px 4px 0;
  position: fixed;
  width: 24px;
  height: 32px;
  i {
    line-height: 30px;
  }
}
.ant-pro-basicLayout .trigger {
  padding: 0;
  line-height: initial;
}
.ant-pro-basicLayout .trigger:hover {
  color: #fff;
}
.selection {
  margin: 0;
  padding: 0;
  min-height: 80vh;
  background: #f0f2f5;
  transition: all 0.2s;
  .content {
    background: white;
    padding: 24px;
    margin: 0 30px;
    height: 100%;
  }
}
.customer-info {
  height: 99%;
  /deep/ .ant-tabs-content {
    height: 100%;
    .tab-content {
      overflow-y: auto;
      height: calc(100% - 200px);
      box-sizing: border-box;
      padding-bottom: 150px;
      .ant-list-items {
        padding-bottom: 200px;
      }
    }
  }
}
.style-list {
  display: inline-block;
  position: relative;
  p {
    text-align: center;
    position: absolute;
    bottom: -4px;
    width: 100px;
    background: rgba(0, 0, 0, 0.5);
    color: white;
  }
}
.imgs {
  width: 100px;
  height: 100px;
  object-fit: scale-down;
  padding: 10px;
  border: 1px dashed #cdcdcd;
  margin-right: 10px;
  margin-bottom: 10px;
  cursor: pointer;
}
.shopping-box {
  height: calc(100% - 257px);
  /deep/ .ant-card-head {
    z-index: 2;
    position: relative;
  }
  /deep/ .ant-card-body {
    height: calc(100%);
    overflow-y: auto;
    padding: 12px 14px 24px;
  }
  .shoppingcart {
    border-bottom: 1px solid #d8d8d8;
    margin-bottom: 17px;
    .ant-list-item {
      padding: 26px 0;
    }
  }
  .cartGood {
    position: relative;
    width: 100%;
    .close {
      position: absolute;
      right: 62px;
      top: -6px;
      font-size: 16px;
    }
    .img-cover {
      object-fit: scale-down;
      height: 100px;
      width: 100px;
      border: 1px dashed #d9d9d9;
      cursor: pointer;
      padding: 8px;
      // margin: 0 auto;
    }
    /deep/ .ant-card-body {
      padding: 12px 4px 0;
      .content {
        h3 {
          color: #1890ff;
          font-weight: normal;
        }
        p {
          margin-bottom: 16px;
        }
        p:nth-child(2) {
          color: #8c8c8c;
        }
      }
    }
  }
}
.price {
  margin-bottom: 6px;
  span {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.78);
  }
  span:last-child {
    color: #8c8c8c;
    text-decoration: line-through;
    margin-left: 6px;
    font-size: 12px;
  }
}
/deep/ .food-list .ant-descriptions-row > td {
  flex-direction: column;
  display: initial;
}
/deep/ #components-demo .ant-descriptions-row > td {
  display: flex;
  width: 100%;
  justify-content: space-between;
  padding-right: 30px;
}
.edit-title {
  padding: 12px 14px 8px 14px;
  box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.2);
  .shop-box {
    display: flex;
    justify-content: space-between;
    .close {
      font-size: 16px;
      cursor: pointer;
    }
  }
  .edit-shop {
    font-size: 14px;
    font-weight: 500;
    color: #262626;
    margin-bottom: 5px;
  }
  .edit-order {
    font-size: 12px;
    font-weight: 400;
    color: #1890ff;
    cursor: pointer;
    line-height: 22px;
    a {
      margin-right: 8px;
    }
  }
}

.footer {
  background: #fff;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 5;
  left: 30px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  text-align: right;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  .total {
    font-size: 14px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #8c8c8c;
    margin-bottom: 0;
    .red {
      color: #ff614e;
    }
    .origin {
      font-size: 12px;
      text-decoration: line-through;
      font-weight: 400;
    }
  }
}
.shoppingcart:hover {
  box-shadow: 0 2px 8px rgb(0 0 0 / 30%);
}
.handle-item {
  width: 24px;
  height: 85px;
  background: #d9d9d9;
  border-radius: 0px 4px 4px 0px;
  font-size: 14px;
  font-weight: 400;
  color: #8c8c8c !important;
  margin-bottom: 4px;
  padding: 8px 0px;
  line-height: 16px;
}
.footer-box {
  padding: 14px;
  font-size: 14px;
  font-weight: 500;
  color: #8c8c8c;
  box-shadow: 0 -1px 6px rgba(0, 0, 0, 0.1);
  position: relative;
  .price-box {
    margin-top: 8px;
    margin-bottom: 8px;
    span:last-child {
      text-decoration: line-through;
      font-size: 12px;
    }
  }
  .edit-color {
    color: #ff614e;
  }
}
.goods {
  // display: flex;
  // position: absolute;
  // top: 15px;
  // bottom: 46px;
  padding-top: 18px;
  padding-left: 12px;
  width: 100%;
  overflow: auto;
  height: 100vh;
  padding-right: 12px;
  padding-bottom: 48px;
}
/deep/.goods {
  .ant-descriptions-row > th,
  .ant-descriptions-row > td {
    padding-bottom: 6px;
    display: inline-block;
    width: 50%;
  }
  .ant-descriptions-item-content {
    color: rgba(0, 0, 0, 0.78);
  }
}
/deep/#components-demo {
  .ant-descriptions-row > th,
  .ant-descriptions-row > td:nth-child(2) {
    padding-bottom: 12px;
    display: inline-block;
    width: 50%;
    text-align: right;
  }
  .ant-descriptions-item-content {
    color: rgba(0, 0, 0, 0.78);
  }
}
.font-color {
  color: #ff9a49;
}
.current {
  background: #1890ff;
  color: #fff !important;
}

.section-title {
  display: flex;
  align-items: center;
}
/deep/ .ant-descriptions-item-label {
  min-width: 96px !important;
  color: #8c8c8c;
}
/deep/ .ant-descriptions-row > td {
  //   display: flex !important;
}
/deep/ .transaction {
  width: 260px;
}
/deep/ .transaction .ant-descriptions-item-label {
  min-width: 40px !important;
}
/deep/ .transaction .ant-descriptions-row > td {
  display: revert !important;
}

/deep/ .undefined-item-content {
  display: flex !important;
  align-items: center;
}
.nickname {
  max-width: 100px !important;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.edit-size {
  font-size: 14px;
  font-weight: 500;
  color: #262626;
  margin-right: 8px;
}
.discount {
  width: 71px;
  height: 18px;
}
.edit-icon {
  width: 18px;
  height: 18px;
  margin-right: 5px;
}
.icon-title {
  font-size: 16px;
  font-weight: 500;
  color: #000000;
}
.ant-carousel {
  margin-top: 6px;
  width: 249px;
  .carousel-imgs {
    height: 100px;
    overflow: hidden;
    height: 54px;
    img {
      width: 54px;
      height: 54px;
      margin: 0 auto;
    }
  }

  .dots-imgs {
    width: 50px;
    height: 50px;
    border: 1px solid #cdcdcd;
    padding: 5px;
    object-fit: scale-down;
  }
  .slick-next::before {
    content: '';
  }
  .slick-prev::before {
    content: '';
  }
  /deep/ .slick-prev {
    left: -30px !important;
    top: 50% !important;
    .anticon {
      font-size: 16px;
    }
  }
  /deep/ .slick-next {
    right: -30px !important;
    top: 50% !important;
    .anticon {
      font-size: 16px;
    }
  }
  .custom-slick-arrow {
    width: 25px;
    height: 25px;
    font-size: 25px;
    color: rgb(116, 116, 116);
    background-color: transparent;
    opacity: 1;
    z-index: 2;
  }
  /deep/ .slick-dots-bottom {
    bottom: 50px;
    li {
      margin: 0 5px;
    }
  }
}
/deep/ .ant-descriptions-item-colon::after {
  content: '' !important;
}
.volume {
  margin-left: 74px;
}
.remark {
  min-height: 120px !important;
  margin-top: 8px;
}
.shape {
  width: 150px;
  margin-top: 8px;
  margin-right: 12px;
}
.edit-row {
  padding: 20px 0px;
}
.commodity—title {
  width: 215px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #262626;
  margin-bottom: 2px;
}
/deep/ .ant-list-something-after-last-item .ant-spin-container > .ant-list-items > .ant-list-item:last-child {
  border-bottom: none !important;
}
/deep/ .ant-list-something-after-last-item .ant-spin-container > .ant-list-items > .ant-list-item:nth-last-child(2) {
  border-bottom: none !important;
}
/deep/ .edit-tag {
  margin-bottom: 8px !important;
}
/deep/ .edit-address {
  display: inline-block !important;
  padding-top: 0;
}
.carousel-imgs {
  height: 100px;
  overflow: hidden;
  height: 54px;
  img {
    width: 54px;
    height: 54px;
    margin: 0 auto;
  }
}
.tag {
  font-size: 12px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #ffffff;
  line-height: 22px;
  position: absolute;
  top: 0px;
  left: 0;
  z-index: 2;
  padding: 0 8px;
  border-radius: 0 0 4px 4px;
  &.red {
    background: #ff7d76;
  }
  &.yellow {
    background: #efb041;
  }
  &.green {
    background: #87d068;
  }
}
.recommend-look {
  left: 28px;
  top: 68px;
  margin: 0;
  width: 72px;
}
.overdue-img {
  width: 40px;
  height: 32px;
  position: absolute;
  top: 10px;
  right: 0;
}
/deep/ .ant-anchor-wrapper {
  overflow: revert !important;
  background: transparent !important;
}
/deep/ .ant-anchor {
  padding-left: 0;
}
/deep/ .ant-anchor-ink {
  width: 0;
}
/deep/ .ant-anchor-link-title {
  border-radius: 0px 4px 4px 0px;
  font-size: 14px;
  padding: 8px 0px;
  line-height: 16px;
  width: 24px;
  height: 85px;
  white-space: break-spaces !important;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #8c8c8c;
  top: -8px;
}
/deep/ .ant-anchor-link-active > .ant-anchor-link-title {
  color: #fff !important;
  background: #1890ff;
  border-radius: 0px 4px 4px 0px;
}
.leaveMsg {
  width: 200px;
  word-break: break-all;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 这里是超出几行省略 */
  overflow: hidden;
}
/deep/ .ant-tag {
  margin-bottom: 10px;
}
/deep/ .ant-empty-normal {
  margin: 0;
}
</style>

